docs: miscellaneous section - #723
Conversation
There was a problem hiding this comment.
Pull request overview
Adds initial content for the “Misc” documentation section of React Native Enriched HTML, replacing TODO placeholders with contributor guidance and platform/feature notes.
Changes:
- Add initial “Roadmap” and “Known limitations” pages with cross-links.
- Add a comprehensive “Contributing” page describing the dev workflow and test commands.
- Replace
compatibility.mdwith a newcompatibility.mdxpage outlining platform differences and compatibility notes.
Reviewed changes
Copilot reviewed 6 out of 6 changed files in this pull request and generated 3 comments.
Show a summary per file
| File | Description |
|---|---|
| docs/docs/misc/roadmap.md | Adds a roadmap page describing planned feature areas. |
| docs/docs/misc/known-limitations.md | Documents current cross-platform limitations and links to related docs. |
| docs/docs/misc/contributing.md | Adds detailed contributor workflow, tooling, and testing guidance. |
| docs/docs/misc/compatibility.mdx | Introduces a compatibility/platform-differences page (MDX). |
| docs/docs/misc/compatibility.md | Removes the previous placeholder compatibility page. |
| docs/docs/misc/comparison-with-other-libraries.md | Leaves the comparison page as header-only (needs placeholder/content). |
Comments suppressed due to low confidence (1)
docs/docs/misc/comparison-with-other-libraries.md:6
- This page currently renders as an empty section (header only). Adding a short placeholder helps readers understand it’s intentionally unfinished until the comparison content is added.
# Comparison with other libraries
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
There was a problem hiding this comment.
Pull request overview
Copilot reviewed 8 out of 8 changed files in this pull request and generated 2 comments.
Comments suppressed due to low confidence (3)
docs/src/components/Compatibility/EnrichedCompatibility.tsx:51
- The first cell in each body row is effectively a row header (the library version). Using
<th scope="row">instead of<td>improves table semantics/accessibility.
<td>
<Version version={version} />
</td>
docs/docs/misc/compatibility.mdx:75
## HTML is not sanitized (Mobile)is placed after## Platform differences, but as a level-2 heading it breaks out of that section, and the following### React Native layout ref methodsbecomes nested under it. Make this a level-3 heading so both items remain part of "Platform differences".
## HTML is not sanitized (Mobile)
On iOS and Android, the library does not sanitize HTML. It makes no guarantees that the markup it accepts or produces is safe. You are fully responsible for sanitizing any HTML you persist, render elsewhere, or accept from untrusted sources.
Sanitization _is_ enforced on the web, as injecting unsafe HTML directly into the DOM poses severe security risks (like XSS).
### React Native layout ref methods
docs/docs/misc/roadmap.md:23
- "ACA" is typically the Affordable Care Act and isn't an accessibility standard; for accessibility compliance in the US it's usually "ADA" (or Section 508). Consider replacing this to avoid confusing readers.
Support for screen readers and accessibility APIs,
delivering a rich, inclusive text editing experience while aligning with WCAG
and ACA standards.
Co-authored-by: Kacper Żółkiewski <74975508+kacperzolkiewski@users.noreply.github.com>
Co-authored-by: Mikołaj Szydłowski <9szydlowski9@gmail.com>
Co-authored-by: Mikołaj Szydłowski <9szydlowski9@gmail.com>
| @@ -0,0 +1,74 @@ | |||
| import React from 'react'; | |||
| import { No, Version, Yes } from './index'; | |||
|
|
|||
There was a problem hiding this comment.
I would like to drop official react-native 0.81 support in 1.2.x. Can we add that to our table? Please mark version as 1.2.x (next)
| `'auto'`. This applies both to `setTextAlignment('justify')` and to the `justify` value reported by | ||
| `onChangeState`. | ||
|
|
||
| ### `ellipsizeMode` with multiple lines (Android) |
There was a problem hiding this comment.
This works the same in the RN TextInput, right? If so, can we add it here so users now it's consistent behavior?
| native editing menu isn't available at all, so the prop is ignored - build your | ||
| own UI instead. | ||
|
|
||
| ### Return key behaviour |
There was a problem hiding this comment.
Same here, I believe those limitations are in the RN as well. Would be good to mark it here as well
|
|
||
| On iOS and Android, the library does not sanitize HTML. It makes no guarantees that the markup it accepts or produces is safe. You are fully responsible for sanitizing any HTML you persist, render elsewhere, or accept from untrusted sources. | ||
|
|
||
| Sanitization _is_ enforced on the web, as injecting unsafe HTML directly into the DOM poses severe security risks (like XSS). |
There was a problem hiding this comment.
Shouldn't this be ?
| Sanitization _is_ enforced on the web, as injecting unsafe HTML directly into the DOM poses severe security risks (like XSS). | |
| Sanitization **is** enforced on the web, as injecting unsafe HTML directly into the DOM poses severe security risks (like XSS). |
| ## Fixed set of HTML tags | ||
|
|
||
| The library intentionally works with a fixed, curated set of standard and | ||
| custom HTML tags rather than accepting arbitrary markup. Tags outside that set | ||
| are stripped or normalized away when they enter the editor. This is a | ||
| deliberate design decision: it keeps the produced HTML portable and guarantees | ||
| that the `EnrichedTextInput` and the `EnrichedText` display render identically. See | ||
| [Supported tags](/fundamentals/html-format-and-supported-tags) for the full | ||
| list. |
There was a problem hiding this comment.
I think we can mention that we might implement new functionalities and add support for more tags in the future. We can also mention that if users need some specific tag it's the best to create a feature request in our repo
| - **iOS** - open `apps/example/ios/EnrichedTextInputExample.xcworkspace` in | ||
| Xcode. Find the sources under **Pods > Development Pods > | ||
| ReactNativeEnrichedHtml**. | ||
| - **Android** - open `apps/example/android` in Android Studio. Find the sources | ||
| under **react-native-enriched-html** in the **Android** view. |
There was a problem hiding this comment.
We have dedicated scripts inside package.json to run proper Xcode workspace or Android project, could you add them here as well?
| yarn example android | ||
|
|
||
| # iOS | ||
| yarn example ios |
There was a problem hiding this comment.
iOS requires installing pods before, let's add a note about it
| The target devices are: | ||
|
|
||
| | Platform | Device | OS | | ||
| | -------- | --------- | ----------------------------- | | ||
| | iOS | iPhone 17 | iOS 26.2 | | ||
| | Android | Pixel 9 | API 36 "Baklava" (Android 16) | |
There was a problem hiding this comment.
Let's make it clear that tests have to be run exactly on those devices, as we are using visual regression testing so using the same screen dimensions and resolution is crucial
|
|
||
| Always review newly saved screenshots before committing them. | ||
|
|
||
| :::note Flaky Android tests on macOS |
There was a problem hiding this comment.
I would definitely rename it. Tests are not flaky and that's the Android emulator limitation
| :::note Flaky Android tests on macOS | |
| :::note Running Android tests on macOS |
|
|
||
| ::: | ||
|
|
||
| When you send a pull request: |
There was a problem hiding this comment.
Let's add a note that if something is unclear or contributor is not sure about proper API it's totally fine to open GitHub issues or discussions and maintainers will help ;)
Summary
Added the
Miscsection to the docs.